<template>
    <div class="contianer">
        <div ref="dom">单个元素</div>
        <div>
            <ul>
                <li v-for="i in 4" :key="i" :ref="setDom">第{{ i }}LI</li>
            </ul>
        </div>
    </div>
</template>

<script>
import { onMounted, ref } from 'vue'
export default {
  name: 'style',
  setup(props) {
    // 1. 获取单个元素,ref 和 return出去的变量一个名字, ref要点value
    const dom = ref(null)
    onMounted(() => {
      // console.log(dom)
      console.log(dom.value)
    })

    // 2. 获取多个元素,先获取单个, 然后加入到数组里面 不需要 .value
    const domList = []
    const setDom = (e) => {
      // console.log(e.value)
      // console.log(e)
      domList.push(e)
    }
    onMounted(() => {
      console.log(domList)
    })
    return { dom, setDom }
  }
}
</script>

<style lang="less" scoped>
</style>
